<!Doctype html>
<html class="no-js" lang="">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>Ruby - Responsive Corporate Tempalte</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <link rel="icon" href="img/header-logo1.png">
        <!-- Place favicon.ico in the root directory -->
		
		<!-- Google Fonts -->
		<link href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i" rel="stylesheet">

		<link rel="stylesheet" href="css/bootstrap.min.css">
		<link rel="stylesheet" href="css/slicknav.min.css">
		<link rel="stylesheet" href="css/bootstrap-theme.min.css">
		<link rel="stylesheet" href="css/owl.carousel.min.css">
		<link rel="stylesheet" href="css/owl.theme.default.min.css">
		<link rel="stylesheet" href="css/animate.min.css">
		<link rel="stylesheet" href="css/animate-text.css">
		<link rel="stylesheet" href="css/magnific-popup.css">
        <link rel="stylesheet" href="css/font-awesome.min.css">
		
		<!-- Ruby CSS -->
        <link rel="stylesheet" href="css/normalize.css">
        <link rel="stylesheet" href="style.css">
		<link rel="stylesheet" href="css/responsive.css">
		
		<!-- Color CSS -->
		<link rel="stylesheet" href="css/color/color7.css">
		<!--<link rel="stylesheet" href="css/color/color1.css">-->
		<!--<link rel="stylesheet" href="css/color/color2.css">-->
		<!--<link rel="stylesheet" href="css/color/color3.css">-->
		<!--<link rel="stylesheet" href="css/color/color4.css">-->
		<!--<link rel="stylesheet" href="css/color/color5.css">-->
		<!--<link rel="stylesheet" href="css/color/color6.css">-->
		<!--<link rel="stylesheet" href="css/color/color8.css">-->
		<!--<link rel="stylesheet" href="css/color/color9.css">-->

		<link rel="stylesheet" href="#" id="colors">
		
    </head>
    <body>
	
		<div class="color-plate ">
			<a class="icon"><i class="fa fa-cog fa-spin"></i></a>
			<h2>Ruby Color</h2>
			<div class="color-head">
				<span class="color1"></span>
				<span class="color2"></span>
				<span class="color3"></span>
				<span class="color4"></span>
				<span class="color5"></span>
				<span class="color6"></span>
				<span class="color7"></span>
				<span class="color8"></span>
				<span class="color9"></span>
			</div>
		</div>
		
		<!-- Header Area -->
		<header id="header" class="header">
			<!-- Header Inner -->
			<div class="header-inner">
				<div class="container">
					<div class="row">
						<div class="col-md-3 col-sm-2 col-xs-2">
							<div class="logo">
								<a href="index.html"><img src="img/logo.png" alt="logo.png"></a>
							</div>
						</div>
						<div class="col-md-9 col-sm-10">
							<div class="mobile-menu"></div>
							<nav class="navbar navbar-default">
								<div class="collapse navbar-collapse">
									<ul id="nav" class="nav navbar-nav">
										<li class="current"><a href="#slider">home</a>
										</li>
										<li><a href="#Services">Services</a></li>
										<li><a href="#latest-works">portfolio<i class="fa fa-caret-down" aria-hidden="true"></i></a>
											<ul class="dropdown">
												<li><a href="portfolio.html">Portfolio</a></li>
												<li><a href="portfolio-single.html">portfolio-single</a></li>
											</ul>
										</li>
										<li><a href="#blog">Blogs<i class="fa fa-caret-down" aria-hidden="true"></i></a>
											<ul class="dropdown">
												<li><a href="blog.html">Blog Archive</a></li>
												<li><a href="blog-single.html">Blog Single</a></li>
											</ul>
										</li>
										<li><a href="#team">Team</a></li>
										<li><a href="#">Pages <i class="fa fa-caret-down" aria-hidden="true"></i></a>
											<ul class="dropdown">
												<li><a href="404.html">Error 404</a></li>
												<li><a href="mail-success.html">Mail Success</a></li>
											</ul>
										</li>
										<li><a href="#contact">Contact</a></li>
									</ul>
								</div>
							</nav>
						</div>
					</div>
				</div>
			</div>
		</header>
		<!--/ End Header Area -->
		
		
		<!--breadcrumb -->
		<div class="breadcrumb" data-stellar-background-ratio="0.5">
			<div class="container">
				<div class="row">
					<div class="col-md-12">
						<div class="breadcrumb-text">
							<h2>single portfolio</h2>
							<ul>
								<li><a href="index.html">Home</a> <i class="fa fa-long-arrow-right" aria-hidden="true"></i></li>
								<li><a href="blog-archive.html">single portfolio</a></li>
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!--/ End breadcrumb -->
		
		
		  
		<!-- single-pf -->
		<section id="single-pf" class=" section">
			<div class="container">
				<div class="row">
					<div class="col-md-12">
						<div class="single-pf owl-carousel">
							<!--Single pf -->
							<div class="single-news">
								<div class="news-head">
									<img src="img/single-pf1.jpg" alt="#">
								</div>
								<div class="news-body">
									<h2>about project</h2>
									<p>Lorem ipsum dolor a sit ameti, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et Lorem ipsum dolor a sit ameti, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et Lorem ipsum dolor a sit ameti, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et Lorem ipsum dolor a sit ameti, consectetur adipisicing elit, </p>
									<h5>project details</h5>
									<span><i class="fa fa-clock-o" aria-hidden="true"></i>date: nov 25, 2017</span>
									<span><i class="fa fa-folder-open-o" aria-hidden="true"></i>category: web design</span>
									<span><i class="fa fa-folder-o" aria-hidden="true"></i>project url: <a href="#">www.twitter.com</a></span>
									<a href="#" class="btn">view live<i class="fa fa-caret-right" aria-hidden="true"></i></a>
								</div>
							</div>
							<!--/ End Single Team -->
							<!--Single pf -->
							<div class="single-news">
								<div class="news-head">
									<img src="img/single-pf2.jpg" alt="#">
								</div>
								<div class="news-body">
									<h2>about project</h2>
									<p>Lorem ipsum dolor a sit ameti, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et Lorem ipsum dolor a sit ameti, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et Lorem ipsum dolor a sit ameti, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et Lorem ipsum dolor a sit ameti, consectetur adipisicing elit, </p>
									<h5>project details</h5>
									<span><i class="fa fa-clock-o" aria-hidden="true"></i>date: dec 12, 2017</span>
									<span><i class="fa fa-folder-open-o" aria-hidden="true"></i>category: branding</span>
									<span><i class="fa fa-folder-o" aria-hidden="true"></i>project url: <a href="#">www.facebook.com</a></span>
									<a href="#" class="btn">view live<i class="fa fa-caret-right" aria-hidden="true"></i></a>
								</div>
							</div>
							<!--/ End Single Team -->
							<!--Single pf -->
							<div class="single-news">
								<div class="news-head">
									<img src="img/single-pf3.jpg" alt="#">
								</div>
								<div class="news-body">
									<h2>about project</h2>
									<p>Lorem ipsum dolor a sit ameti, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et Lorem ipsum dolor a sit ameti, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et Lorem ipsum dolor a sit ameti, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et Lorem ipsum dolor a sit ameti, consectetur adipisicing elit, </p>
									<h5>project details</h5>
									<span><i class="fa fa-clock-o" aria-hidden="true"></i>date: jan 30, 2017</span>
									<span><i class="fa fa-folder-open-o" aria-hidden="true"></i>category: wordpress</span>
									<span><i class="fa fa-folder-o" aria-hidden="true"></i>project url: <a href="#">www.google.com</a></span>
									<a href="#" class="btn">view live<i class="fa fa-caret-right" aria-hidden="true"></i></a>
								</div>
							</div>
							<!--/ End Single Team -->
						</div>
					</div>
				</div>
			</div>
		</section>
		<!--/ End single-pf -->
		
	
		<!-- Footer Area -->
		<footer id="footer" class="footer section">
			<!-- Footer Top -->
			<div class="footer-top">
				<div class="container">
					<div class="row">
						<div class="col-md-3 col-sm-3 col-xs-12">
							<div class="single-footer">
								<div class="logo">
									<img src="img/ruby.png" alt="#">
								</div>
								<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit,  consectetur adipisicing elit, </p>
								<div class="contact">
									<p class="location"><i class="fa fa-map-marker" aria-hidden="true"></i>Mirpur, dhaka-bangledesh</p>
									<p class="mail-add"><i class="fa fa-envelope-o" aria-hidden="true"></i>info@clippinglamp.com</p>
									<p class="call"><i class="fa fa-phone-square" aria-hidden="true"></i>call:900-200-2315</p>
								</div>
							</div>
						</div>
						<div class="col-md-3 col-sm-3 col-xs-12">
							<div class="single-footer">
								<h2><i class="fa fa-sliders" aria-hidden="true"></i>setra site map</h2>
								<span><i class="fa fa-caret-right" aria-hidden="true"></i>home</span>
								<span><i class="fa fa-caret-right" aria-hidden="true"></i>our shop</span>
								<span><i class="fa fa-caret-right" aria-hidden="true"></i>about us</span>
								<span><i class="fa fa-caret-right" aria-hidden="true"></i>blog</span>
								<span><i class="fa fa-caret-right" aria-hidden="true"></i>your account</span>
								<span><i class="fa fa-caret-right" aria-hidden="true"></i>our guarantee</span>
							</div>
						</div>
						<div class="col-md-3 col-sm-3 col-xs-12">
							<div class="single-footer">
								<h2><i class="fa fa-cogs" aria-hidden="true"></i>our company</h2>
								<span><i class="fa fa-caret-right" aria-hidden="true"></i>shipping policy</span>
								<span><i class="fa fa-caret-right" aria-hidden="true"></i>international shipping</span>
								<span><i class="fa fa-caret-right" aria-hidden="true"></i>affiliates</span>
								<span><i class="fa fa-caret-right" aria-hidden="true"></i>our sponsors</span>
								<span><i class="fa fa-caret-right" aria-hidden="true"></i>team & conditions</span>
								<span><i class="fa fa-caret-right" aria-hidden="true"></i>cash on delivery</span>
							</div>
						</div>
						<div class="col-md-3 col-sm-3 col-xs-12">
							<div class="single-footer">
								<h2>newsletter subscription</h2>
								<p>subscribe to our newsletter to get allour news in your inbox</p>
								<div class="mail">
									<input type="email" placeholder="Enter your email">
									<button class="button"><a href="#">subscribe us</a></button>
									<i class="fa fa-lock"  class="icon"></i>
									<p>Your email address is 100% safe to us</p>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!--/ End Footer Top -->

			<!-- Copyright -->
			<div class="copyright">
				<div class="container">
					<div class="row">
						<div class="col-md-6 col-sm-6 col-xs-12">
							<div class="copyright-content">
								<p>Copyright 2018 | Ruby Limtied | All Rights Reserved</p>
							</div>
						</div>
						<div class="col-md-6 col-sm-6 col-xs-12">
							<ul class="social">
								<li><a href=""><i class="fa fa-facebook"></i></a></li>
								<li><a href=""><i class="fa fa-twitter"></i></a></li>
								<li><a href=""><i class="fa fa-instagram"></i></a></li>
								<li><a href=""><i class="fa fa-linkedin"></i></a></li>
								<li><a href=""><i class="fa fa-youtube"></i></a></li>
							</ul>
						</div>
					</div>
				</div>
			</div>
			<!--/ End Copyright -->
		</footer>
		<!--/ End Footer Area -->
			
        <script src="js/jquery.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
		<script src="js/colors.js"></script>
        <script src="js/jquery.nav.js"></script>
        <script src="js/jquery.scrollUp.min.js"></script>
        <script src="js/jquery.slicknav.min.js"></script>
		<script src="http://cdnjs.cloudflare.com/ajax/libs/waypoints/2.0.3/waypoints.min.js"></script>
        <script src="js/owl.carousel.min.js"></script>
		<script src="js/isotope.pkgd.min.js"></script>
		<script src="js/wow.min.js"></script>
		<script src="js/jquery.stellar.min.js"></script>
		<script src="js/jquery.magnific-popup.min.js"></script>
		<script src="js/animate-text.js"></script>
		<script src="js/particles.min.js"></script>
		<script src="js/particle-code.js"></script>
		<script src="js/jquery.counterup.min.js"></script>
		
        <script type="text/javascript" src="js/gmaps.min.js"></script>
        <script src="js/main.js"></script>
    </body>
</html>